{% block sw_promotion_v2_detail_base %}
<div class="sw-promotion-v2-detail-base">

    {% block sw_promotion_v2_detail_base_general_card %}
    <mt-card
        v-if="promotion"
        position-identifier="sw-promotion-detail-base-general"
        class="sw-promotion-v2-detail-base__card-general"
        :is-loading="isLoading"
        :title="$tc('sw-promotion-v2.detail.base.general.cardTitle')"
    >

        {% block sw_promotion_v2_detail_base_general_name %}
        <sw-container
            columns="2fr 1fr"
            gap="0 32px"
        >

            <mt-text-field
                v-model="promotion.name"
                class="sw-promotion-v2-detail-base__field-name"
                :label="$tc('sw-promotion-v2.detail.base.general.nameLabel')"
                :disabled="!acl.can('promotion.editor')"
                required
                :error="promotionNameError"
                :placeholder="placeholder(promotion, 'name', $tc('sw-promotion-v2.detail.base.general.namePlaceholder'))"
            />

            <mt-number-field
                v-model="promotion.priority"
                :disabled="!acl.can('promotion.editor')"
                :label="$tc('sw-promotion-v2.detail.base.general.priorityLabel')"
                :step="1"
                :min="0"
                number-type="int"
                :help-text="$tc('sw-promotion-v2.detail.base.general.helpTextPriority')"
            />
        </sw-container>
        {% endblock %}

        {% block sw_promotion_v2_detail_base_general_valid_container %}
        <sw-container
            columns="1fr 1fr"
            gap="0 32px"
        >

            {% block sw_promotion_v2_detail_base_general_valid_from %}
            <mt-datepicker
                v-model="promotion.validFrom"
                class="sw-promotion-v2-detail-base__field-valid-from"
                date-type="datetime"
                :label="$tc('sw-promotion-v2.detail.base.general.validFromLabel')"
                :placeholder="$tc('sw-promotion-v2.detail.base.general.validFromPlaceholder')"
                :disabled="!acl.can('promotion.editor')"
            />
            {% endblock %}

            {% block sw_promotion_v2_detail_base_general_valid_until %}
            <mt-datepicker
                v-model="promotion.validUntil"
                class="sw-promotion-v2-detail-base__field-valid-until"
                date-type="datetime"
                :label="$tc('sw-promotion-v2.detail.base.general.validUntilLabel')"
                :placeholder="$tc('sw-promotion-v2.detail.base.general.validUntilPlaceholder')"
                :disabled="!acl.can('promotion.editor')"
                :error="promotionValidUntilError"
            />
            {% endblock %}

        </sw-container>
        {% endblock %}

        {% block sw_promotion_v2_detail_base_general_max_uses %}
        <sw-container
            columns="1fr 1fr"
            gap="0 32px"
        >

            {% block sw_promotion_v2_detail_base_general_max_uses_global %}
            <mt-number-field
                v-model="promotion.maxRedemptionsGlobal"
                class="sw-promotion-v2-detail-base__field-max-uses-global"
                number-type="int"
                :label="$tc('sw-promotion-v2.detail.base.general.maxUsesGlobalLabel')"
                :placeholder="$tc('sw-promotion-v2.detail.base.general.maxUsesGlobalPlaceholder')"
                :disabled="!acl.can('promotion.editor')"
                :min="1"
                allow-empty
            />
            {% endblock %}

            {% block sw_promotion_v2_detail_base_general_max_uses_customer %}
            <mt-number-field
                v-model="promotion.maxRedemptionsPerCustomer"
                class="sw-promotion-v2-detail-base__field-max-uses-per-customer"
                number-type="int"
                :label="$tc('sw-promotion-v2.detail.base.general.maxUsesPerCustomerLabel')"
                :placeholder="$tc('sw-promotion-v2.detail.base.general.maxUsesPerCustomerPlaceholder')"
                :disabled="!acl.can('promotion.editor')"
                :min="1"
                allow-empty
            />
            {% endblock %}

        </sw-container>
        {% endblock %}

        {% block sw_promotion_v2_detail_base_general_active %}

        <mt-switch
            v-model="promotion.active"
            class="sw-promotion-v2-detail-base__field-active"
            :label="$tc('sw-promotion-v2.detail.base.general.activeLabel')"
            :disabled="!acl.can('promotion.editor')"
            bordered
        />
        {% endblock %}

    </mt-card>
    {% endblock %}

    {% block sw_promotion_v2_detail_base_codes_card %}
    <mt-card
        v-if="promotion && !isCreateMode"
        class="sw-promotion-v2-detail-base__card-codes"
        position-identifier="sw-promotion-detail-base-codes"
        :is-loading="isLoading"
        :title="$tc('sw-promotion-v2.detail.base.codes.cardTitle')"
    >

        {% block sw_promotion_v2_detail_base_codes_select %}
        <mt-select
            class="sw-promotion-v2-detail-base__field-code-type"
            :label="$tc('sw-promotion-v2.detail.base.codes.codeTypeLabel')"
            :disabled="!acl.can('promotion.editor')"
            :model-value="selectedCodeType"
            :options="codeTypeOptions"
            @update:model-value="onChangeCodeType"
        />
        {% endblock %}

        {% block sw_promotion_v2_detail_base_codes_type_fixed %}
        <template v-if="selectedCodeType === CODE_TYPES.FIXED">

            {% block sw_promotion_v2_detail_base_codes_type_fixed_code %}

            <mt-text-field
                v-model="promotion.code"
                class="sw-promotion-v2-detail-base__fixed-field-code"
                :disabled="!acl.can('promotion.editor')"
                :label="$tc('sw-promotion-v2.detail.base.codes.fixed.codeLabel')"
                :placeholder="$tc('sw-promotion-v2.detail.base.codes.fixed.codePlaceholder')"
                copyable
            />
            {% endblock %}

            {% block sw_promotion_v2_detail_base_codes_type_fixed_generate %}
            <sw-button-process
                class="sw-promotion-v2-detail-base__fixed-generate-button"
                :is-loading="isGenerating"
                :disabled="!acl.can('promotion.editor')"
                :process-success="isGenerateSuccessful"
                @update:process-success="generateFinish"
                @click.prevent="onGenerateCodeFixed"
            >
                {{ $tc('sw-promotion-v2.detail.base.codes.fixed.generateButton') }}
            </sw-button-process>
            {% endblock %}

        </template>
        {% endblock %}

        {% block sw_promotion_v2_detail_base_codes_type_individual %}
        <template v-else-if="selectedCodeType === CODE_TYPES.INDIVIDUAL">

            {% block sw_promotion_v2_detail_base_codes_type_individual_codes_behavior %}
            <sw-promotion-v2-individual-codes-behavior
                :promotion="promotion"
                @generate-finish="$emit('generate-individual-codes-finish')"
                @delete-finish="$emit('delete-individual-codes-finish')"
            />
            {% endblock %}

        </template>
        {% endblock %}

    </mt-card>
    {% endblock %}

    {% block sw_promotion_detail_custom_field_sets %}
    <mt-card
        v-if="showCustomFields"
        position-identifier="sw-promotion-detail-base-custom-field-sets"
        :title="$tc('sw-settings-custom-field.general.mainMenuItemGeneral')"
        :is-loading="isLoading"
    >
        <sw-custom-field-set-renderer
            :entity="promotion"
            :disabled="!acl.can('promotion.editor')"
            :sets="customFieldSets"
        />
    </mt-card>
    {% endblock %}
</div>
{% endblock %}
